home *** CD-ROM | disk | FTP | other *** search
/ Personal Computer World 2006 May / PCWMAY06.iso / Software / Freeware / First Page 2006 3.00 / fp2006-final-3.00-setup.exe / {app} / Iscripts / Forms Misc / dropdown-box-pop.izs < prev    next >
Text File  |  2005-09-28  |  8KB  |  305 lines

  1. <!NOWIZARD>
  2.  
  3. <!TITLE>Dropdown Box Population
  4. <!/TITLE>
  5.  
  6. <!DESCRIPTION>This series of dropdown boxes are automatically populated with choices based on the first dropdown box. Pretty handy! IE only. <!/DESCRIPTION> 
  7.  
  8. <!CATEGORY>Forms<!/CATEGORY>
  9.  
  10. <!SCRIPT>
  11. <!-- START OF SCRIPT -->
  12.  
  13. <!-- HOW TO INSTALL DROPDOWN BOX POPULATION:
  14.  
  15.   1.  Copy code into the HEAD section of document
  16.   2.  Put last coding into the BODY section of document  -->
  17.  
  18. <!-- STEP ONE: Add code into HEAD section of document  -->
  19.  
  20. <HEAD>
  21.  
  22. <SCRIPT LANGUAGE="JavaScript">
  23.  
  24. <!-- Original:  Andrew Berry (aberry@berrysystems.com) -->
  25. <!-- Web Site:  http://www.berrysystems.com -->
  26.  
  27. <!-- Begin
  28. var arrItems1 = new Array();
  29. var arrItemsGrp1 = new Array();
  30.  
  31. arrItems1[3] = "Truck";
  32. arrItemsGrp1[3] = 1;
  33. arrItems1[4] = "Train";
  34. arrItemsGrp1[4] = 1;
  35. arrItems1[5] = "Car";
  36. arrItemsGrp1[5] = 1;
  37.  
  38. arrItems1[6] = "Boat";
  39. arrItemsGrp1[6] = 2;
  40. arrItems1[7] = "Submarine";
  41. arrItemsGrp1[7] = 2;
  42.  
  43. arrItems1[0] = "Planes";
  44. arrItemsGrp1[0] = 3;
  45. arrItems1[1] = "Ultralight";
  46. arrItemsGrp1[1] = 3;
  47. arrItems1[2] = "Glider";
  48. arrItemsGrp1[2] = 3;
  49.  
  50. var arrItems2 = new Array();
  51. var arrItemsGrp2 = new Array();
  52.  
  53. arrItems2[21] = "747";
  54. arrItemsGrp2[21] = 0
  55. arrItems2[22] = "Cessna";
  56. arrItemsGrp2[22] = 0
  57.  
  58. arrItems2[31] = "Kolb Flyer";
  59. arrItemsGrp2[31] = 1
  60. arrItems2[34] = "Kitfox";
  61. arrItemsGrp2[34] = 1
  62.  
  63. arrItems2[35] = "Schwietzer Glider";
  64. arrItemsGrp2[35] = 2
  65.  
  66. arrItems2[99] = "Chevy Malibu";
  67. arrItemsGrp2[99] = 5
  68. arrItems2[100] = "Lincoln LS";
  69. arrItemsGrp2[100] = 5
  70. arrItems2[57] = "BMW Z3";
  71. arrItemsGrp2[57] = 5
  72.  
  73. arrItems2[101] = "F-150";
  74. arrItemsGrp2[101] = 3
  75. arrItems2[102] = "Tahoe";
  76. arrItemsGrp2[102] = 3
  77.  
  78. arrItems2[103] = "Freight Train";
  79. arrItemsGrp2[103] = 4
  80. arrItems2[104] = "Passenger Train";
  81. arrItemsGrp2[104] = 4
  82.  
  83. arrItems2[105] = "Oil Tanker";
  84. arrItemsGrp2[105] = 6
  85. arrItems2[106] = "Fishing Boat";
  86. arrItemsGrp2[106] = 6
  87.  
  88. arrItems2[200] = "Los Angelas Class";
  89. arrItemsGrp2[200] = 7
  90. arrItems2[201] = "Kilo Class";
  91. arrItemsGrp2[201] = 7
  92. arrItems2[203] = "Seawolf Class";
  93. arrItemsGrp2[203] = 7
  94.  
  95. function selectChange(control, controlToPopulate, ItemArray, GroupArray)
  96. {
  97.   var myEle ;
  98.   var x ;
  99.   // Empty the second drop down box of any choices
  100.   for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null;
  101.   if (control.name == "firstChoice") {
  102.     // Empty the third drop down box of any choices
  103.     for (var q=myChoices.thirdChoice.options.length;q>=0;q--) myChoices.thirdChoice.options[q] = null;
  104.  }
  105.   // ADD Default Choice - in case there are no values
  106.   myEle = document.createElement("option") ;
  107.   myEle.value = 0 ;
  108.   myEle.text = "[SELECT]" ;
  109.   controlToPopulate.add(myEle) ;
  110.   // Now loop through the array of individual items
  111.   // Any containing the same child id are added to
  112.   // the second dropdown box
  113.   for ( x = 0 ; x < ItemArray.length  ; x++ )
  114.     {
  115.       if ( GroupArray[x] == control.value )
  116.         {
  117.           myEle = document.createElement("option") ;
  118.           myEle.value = x ;
  119.           myEle.text = ItemArray[x] ;
  120.           controlToPopulate.add(myEle) ;
  121.         }
  122.     }
  123. }
  124. //  End -->
  125. </script>
  126.  
  127. </HEAD>
  128.  
  129. <!-- STEP TWO: Add code into BODY section of document  -->
  130.  
  131. <BODY>
  132.  
  133. <form name=myChoices>
  134. <table align="center">
  135. <tr>
  136. <td>
  137. <SELECT id=firstChoice name=firstChoice onchange="selectChange(this, myChoices.secondChoice, arrItems1, arrItemsGrp1);">
  138.     <option value=0 SELECTED>[SELECT]</option>
  139.     <option value=1>Land</option>
  140.     <option value=2>Sea</option>
  141.     <option value=3>Air</option>
  142. </SELECT>
  143. </TD><TD>
  144. <SELECT id=secondChoice name=secondChoice onchange="selectChange(this, myChoices.thirdChoice, arrItems2, arrItemsGrp2);">
  145. </SELECT>
  146. <SELECT id=thirdChoice name=thirdChoice>
  147. </SELECT>
  148. </TD>
  149. </TR>
  150. </TABLE>
  151. </form>
  152.  
  153.  
  154. <!-- END OF SCRIPT -->
  155. <!/SCRIPT>
  156.  
  157. <!PREVIEW>
  158. <!-- START OF SCRIPT -->
  159.  
  160. <!-- HOW TO INSTALL DROPDOWN BOX POPULATION:
  161.  
  162.   1.  Copy code into the HEAD section of document
  163.   2.  Put last coding into the BODY section of document  -->
  164.  
  165. <!-- STEP ONE: Add code into HEAD section of document  -->
  166.  
  167. <HEAD>
  168.  
  169. <SCRIPT LANGUAGE="JavaScript">
  170.  
  171. <!-- Original:  Andrew Berry (aberry@berrysystems.com) -->
  172. <!-- Web Site:  http://www.berrysystems.com -->
  173.  
  174. <!-- Begin
  175. var arrItems1 = new Array();
  176. var arrItemsGrp1 = new Array();
  177.  
  178. arrItems1[3] = "Truck";
  179. arrItemsGrp1[3] = 1;
  180. arrItems1[4] = "Train";
  181. arrItemsGrp1[4] = 1;
  182. arrItems1[5] = "Car";
  183. arrItemsGrp1[5] = 1;
  184.  
  185. arrItems1[6] = "Boat";
  186. arrItemsGrp1[6] = 2;
  187. arrItems1[7] = "Submarine";
  188. arrItemsGrp1[7] = 2;
  189.  
  190. arrItems1[0] = "Planes";
  191. arrItemsGrp1[0] = 3;
  192. arrItems1[1] = "Ultralight";
  193. arrItemsGrp1[1] = 3;
  194. arrItems1[2] = "Glider";
  195. arrItemsGrp1[2] = 3;
  196.  
  197. var arrItems2 = new Array();
  198. var arrItemsGrp2 = new Array();
  199.  
  200. arrItems2[21] = "747";
  201. arrItemsGrp2[21] = 0
  202. arrItems2[22] = "Cessna";
  203. arrItemsGrp2[22] = 0
  204.  
  205. arrItems2[31] = "Kolb Flyer";
  206. arrItemsGrp2[31] = 1
  207. arrItems2[34] = "Kitfox";
  208. arrItemsGrp2[34] = 1
  209.  
  210. arrItems2[35] = "Schwietzer Glider";
  211. arrItemsGrp2[35] = 2
  212.  
  213. arrItems2[99] = "Chevy Malibu";
  214. arrItemsGrp2[99] = 5
  215. arrItems2[100] = "Lincoln LS";
  216. arrItemsGrp2[100] = 5
  217. arrItems2[57] = "BMW Z3";
  218. arrItemsGrp2[57] = 5
  219.  
  220. arrItems2[101] = "F-150";
  221. arrItemsGrp2[101] = 3
  222. arrItems2[102] = "Tahoe";
  223. arrItemsGrp2[102] = 3
  224.  
  225. arrItems2[103] = "Freight Train";
  226. arrItemsGrp2[103] = 4
  227. arrItems2[104] = "Passenger Train";
  228. arrItemsGrp2[104] = 4
  229.  
  230. arrItems2[105] = "Oil Tanker";
  231. arrItemsGrp2[105] = 6
  232. arrItems2[106] = "Fishing Boat";
  233. arrItemsGrp2[106] = 6
  234.  
  235. arrItems2[200] = "Los Angelas Class";
  236. arrItemsGrp2[200] = 7
  237. arrItems2[201] = "Kilo Class";
  238. arrItemsGrp2[201] = 7
  239. arrItems2[203] = "Seawolf Class";
  240. arrItemsGrp2[203] = 7
  241.  
  242. function selectChange(control, controlToPopulate, ItemArray, GroupArray)
  243. {
  244.   var myEle ;
  245.   var x ;
  246.   // Empty the second drop down box of any choices
  247.   for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null;
  248.   if (control.name == "firstChoice") {
  249.     // Empty the third drop down box of any choices
  250.     for (var q=myChoices.thirdChoice.options.length;q>=0;q--) myChoices.thirdChoice.options[q] = null;
  251.  }
  252.   // ADD Default Choice - in case there are no values
  253.   myEle = document.createElement("option") ;
  254.   myEle.value = 0 ;
  255.   myEle.text = "[SELECT]" ;
  256.   controlToPopulate.add(myEle) ;
  257.   // Now loop through the array of individual items
  258.   // Any containing the same child id are added to
  259.   // the second dropdown box
  260.   for ( x = 0 ; x < ItemArray.length  ; x++ )
  261.     {
  262.       if ( GroupArray[x] == control.value )
  263.         {
  264.           myEle = document.createElement("option") ;
  265.           myEle.value = x ;
  266.           myEle.text = ItemArray[x] ;
  267.           controlToPopulate.add(myEle) ;
  268.         }
  269.     }
  270. }
  271. //  End -->
  272. </script>
  273.  
  274. </HEAD>
  275.  
  276. <!-- STEP TWO: Add code into BODY section of document  -->
  277.  
  278. <BODY>
  279.  
  280. <form name=myChoices>
  281. <table align="center">
  282. <tr>
  283. <td>
  284. <SELECT id=firstChoice name=firstChoice onchange="selectChange(this, myChoices.secondChoice, arrItems1, arrItemsGrp1);">
  285.     <option value=0 SELECTED>[SELECT]</option>
  286.     <option value=1>Land</option>
  287.     <option value=2>Sea</option>
  288.     <option value=3>Air</option>
  289. </SELECT>
  290. </TD><TD>
  291. <SELECT id=secondChoice name=secondChoice onchange="selectChange(this, myChoices.thirdChoice, arrItems2, arrItemsGrp2);">
  292. </SELECT>
  293. <SELECT id=thirdChoice name=thirdChoice>
  294. </SELECT>
  295. </TD>
  296. </TR>
  297. </TABLE>
  298. </form>
  299.  
  300.  
  301. <!-- END OF SCRIPT -->
  302. <!/PREVIEW>
  303.  
  304. <!RELATED>NONE<!/RELATED>
  305.